<template>
    <div class="wrap">
        <div>
            <div class="gswwUi-layout">
              <div class="header">
                  <Row>
                      <Col span="18">
                        Java统一开发平台    
                      </Col>
                      <Col span="6">
                        欢迎您，{{$store.getters.getUser.userName}}
                        <Button type="primary" ghost @click="logout">退出</Button>
                      </Col>
                  </Row>
              </div>
              <div class="main-wraper">
                    <Row>
                        <Col span="4">
                            <!--left nav -->
                            <div class="left menu">
                                <Menu   active-name="1" width="auto" @on-select="selectMenu">
                                    <Submenu name="1" v-for="menu in menuList" :key="menu.MENU_ID">
                                        <template slot="title">
                                            <Icon :type="menu.MENU_IMG"></Icon>
                                             {{menu.MENU_NAME}}
                                        </template>
                                        <MenuItem :name="subMenu.MENU_IMG" v-for="subMenu in menu.menuItems" :key="subMenu.MENU_ID">
                                        {{subMenu.MENU_NAME}}
                                        </MenuItem>
                                    </Submenu>
                                  
                              </Menu>
                            </div>
                        </Col>
                        <Col span="20">
                            <!--content-->
                            <div class="" style="padding:10px">
                                <router-view></router-view>
                            </div>
                        </Col>
                    </Row>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
export default {
    data() {
        return{
            theme2: 'dark',
            menuList:[]
        }
    },
    created(){
        this.menuList = eval('('+this.$store.getters.getUser.menuList+')')
        //console.log('length=',this.menuList.length);
    },
    methods:{
      selectMenu(name){
          console.log('name=',name)
        this.$router.push({name:name})
      },
      logout(){
        this.$store.commit('logout')
        this.$router.push({name:'login'})
      }
    }
}
</script>
<style lang="scss" scopedSlots>
  .menu{
    border:1px solid gray;
    height:100%;
  }
</style>>

</style>
